<template>
  <layoutBlock >
    <div class="content">
      <div class="fliter-list">
        <RadioGroup v-model="alarmDateType"  type="button" button-style="solid" @on-change="handleAlarmDateType">
          <Radio   :label="item.value"  v-for="item in statusList"  >{{item.name}}</Radio>
        </RadioGroup>
        <DatePicker class="data-picker" @on-change="changeData" v-if="dateShow" v-model="condition.alarmStartDate" type="date" placeholder="请选择时间" style="width: 200px"></DatePicker>
      </div>

      <Table :loading="loading" @on-selection-change="selectList" border class="mt20" ref="selection" :columns="columns2" :data="data1">
        <template slot-scope="{ row, index }" slot="handledStatus" >
          <Tag color="#87d068" v-if="row.handledStatus == 1"> 已处理 </Tag>
          <Tag color="#cd201f" v-else> 未处理 </Tag>
        </template>
      </Table>
      <div class="disflex mt30">
        <Page :total="total" v-if="total>condition.limit"  :current="condition.start" show-elevator @on-change="changepage"></Page>
      </div>
    </div>
  </layoutBlock>
</template>
<script>
import {projectType,alarmList,projectDel} from '@/api/device';
import tool from "../../libs/tool";
import moment from 'moment'
import base from '@/mixins/base';
export default {
  mixins: [base],
  data () {
    return {
      loading:false,
      total:0,//总条数
      roleId:'',
      editorData:{},
      title:'编辑',
      alarmDateType:0,
      dateShow:false,
      statusList:[
        {name:'全部',value:0},
        {name:'今天',value:1},
        {name:'昨天',value:2},
        {name:'近7天',value:3},
        {name:'近30天',value:4},
        {name:'选择日期',value:5},
      ],
      condition:{//头部筛选传参
        alarmStartDate:'',
        limit:10,
        start:1
      },
      columns2: [
        {
          title: '发生时间',
          key: 'createdAt'
        },
        {
          title: '告警设备编码',
          key: 'code'
        },
        {
          title: '告警内容',
          key: 'status',
          ellipsis:true
        },
        {
          title: '设备位置',
          key: 'address',
          ellipsis:true
        },
        {
          title: '处理状态',
          slot: 'handledStatus',
          align:'center'
        },
      ],
      data1: [],
      detail:'',
      ids:'',
      isAdd:true,
      noShow:false,
      userId:'',
      isShowUser:false,
      selectlist:[],
      orgList:[],

    }
  },
  created(){
    this.getData();
  },
  methods: {
    handleAlarmDateType(value,e){
       if(value==5){
         this.dateShow=true
       }else if(value == 0){
         this.dateShow=false;
         this.condition.alarmStartDate='';
         this.getData();
       }else{
         this.dateShow=false;
         this.condition.alarmStartDate=this.getTime(value);
         this.getData();
       }
    },
    changeData(){
      this.getData();
    },
    getTime(label){
      switch (label){
        case 1:
          return moment().format('YYYY-MM-DD');
        case 2:
          return moment().subtract(1, 'days').format('YYYY-MM-DD');
        case 3:
          return moment().subtract(7, 'days').format('YYYY-MM-DD');
        case 4:
          return moment().subtract(30, 'days').format('YYYY-MM-DD');
      }
    },
    selectList(value){
      this.condition.start=1;
      this.selectlist=value
    },
    delAll(){
      let arr= this.selectlist.map(item=>{
        return item.id
      })
      if(arr.length==0){
        this.$Message.warning('请先选择项目！')
        return
      }
      this.getDel({id:arr.join()},1)
    },
    success(){
      this.getData();
      this.isShow=false;
      this.isShow03=false;
    },
    //获取列表
    async getData(){
      this.loading=true;
      let {limit,start}  = this.condition;
      let parms=this.alarmDateType==5?{limit,start,alarmDate:moment(this.condition.alarmStartDate).format('YYYY-MM-DD'),porgIds:this.orgIds}:{...this.condition ,porgIds:this.orgIds}
      let  res = !this.orgIds?this.defaultListData:await  alarmList(parms);
      this.loading=false;
      this.data1= _.get(res,'data.records') ||[];
      this.total=_.get(res,'data.total')||0;
    },
    //分页projectType
    changepage(page){
      this.condition.start = page
      this.getData()
    },
    getEdit(row,type){
      this.isAdd=type;
      this.isShow = true;
      if(type) return;
      let {address,bz,name,id,orgId,regdate} = row;
      let regionCode=[];
      if(row.province) regionCode.push(row.province);
      if(row.city) regionCode.push(row.city);
      if(row.district) regionCode.push(row.district);
      this.editorData={address,bz,name,id,orgId,regdate,regionCode}
    },
    async getDel(row,type){
      if(type==1){
        this.ids = row.id
        this.isShow2 = true;
      }else{
        let res = await projectDel({projectIds:this.ids});
        if(_.get(res,'code')==0){
          this.isShow2 = false;
          this.$Message.success('删除成功')
          this.getData();
        }else{
          this.$Message.error(_.get(res,'message')||'删除失败！')
        }
      }
    },

    cancel(){},
  }
}
</script>

<style scoped lang="less">
.fliter-list{
  display: flex;
  .data-picker{
    margin-left: 20px;
  }
}
</style>
